import './assets/main.scss';

import router from '@/router';
import ElementPlus from 'element-plus';
import 'element-plus/dist/index.css';
import locale from 'element-plus/dist/locale/zh-cn.js';
import { createPinia } from 'pinia';
import { createPersistedState } from 'pinia-persistedstate-plugin';
import { createApp } from 'vue';
import App from './App.vue';
// 导入图片懒加载插件
import VueLazyload from 'vue-lazyload';

// 使用ES模块语法导入图片资源
import errorImg from '@/assets/error.jpg';
import loadingImg from '@/assets/loading.gif';

const app = createApp(App)
const pinia = createPinia();
const persist = createPersistedState();
pinia.use(persist)

// 配置并使用懒加载插件
app.use(VueLazyload, {
  preLoad: 1.3,
  error: errorImg,  // 使用导入的图片变量
  loading: loadingImg,  // 使用导入的图片变量
  attempt: 3,
  listenEvents: ['scroll', 'wheel', 'mousewheel', 'resize', 'animationend', 'transitionend', 'touchmove']
})

app.use(pinia)
app.use(router)
app.use(ElementPlus, { locale })
app.mount('#app')
